theme: Make %notification_bubble a mixin

And simplify .datemenu-today-button styling by using it.

This allows removing duplicate code for flat notification_bubble
styling.

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/957

diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
index 64783486a033781a613bcf33e076d66853eab377..d218557871513e9ade53701ebdca1921b03e30eb 100644 (file)
--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
@@ -155,14 +155,17 @@ stage {
 
 
 // notification styling
-%notification_bubble {
+@mixin notification_bubble($flat: false) {
   border-width: 1px;
   border-style: solid;
-  border-radius:$base_border_radius + 2px;
-  padding: 0;
+  border-radius: $base_border_radius + 2px;
   margin: $base_margin;
 
-  @include button(normal);
+  @if $flat {
+    @include button(undecorated);
+  } @else {
+    @include button(normal);
+  }
 
   &:focus {
     @include button(focus);

diff --git a/data/theme/gnome-shell-sass/widgets/_calendar.scss b/data/theme/gnome-shell-sass/widgets/_calendar.scss
index 0331dd33f8692be5dee72401b09aca0cd612b33e..fa1e75fe812cc7bd691b9115d36d46f9f1b53704 100644 (file)
--- a/data/theme/gnome-shell-sass/widgets/_calendar.scss
+++ b/data/theme/gnome-shell-sass/widgets/_calendar.scss
@@ -21,17 +21,8 @@
 
   // today button (the date)
   .datemenu-today-button {
+    @include notification_bubble($flat: true);
     padding: $base_padding * 1.5;
-    margin: $base_margin;
-    border: 1px solid transparent;
-    border-radius: $base_border_radius + 2px;
-
-    &:hover { @include button(hover);}
-    &:focus { @include button(focus);}
-
-    &:active {
-      @include button(active);
-    }
 
     // weekday label
     .day-label {
@@ -48,8 +39,7 @@
 
   // calendar
   .calendar {
-    @extend %notification_bubble;
-    margin: $base_margin;
+    @include notification_bubble;
     margin-bottom: $base_padding + $base_margin;
     padding: $base_padding;
 
@@ -67,7 +57,7 @@
     // world clocks and weather
     .world-clocks-button,
     .weather-button {
-      @extend %notification_bubble;
+      @include notification_bubble;
       padding: $base_padding;
     }
   }

diff --git a/data/theme/gnome-shell-sass/widgets/_message-list.scss b/data/theme/gnome-shell-sass/widgets/_message-list.scss
index adedcf71dea055fe298dbb7238dd0320b8fbdb61..9893b68972648482aa8b07ebcb848c7fc90fe3fb 100644 (file)
--- a/data/theme/gnome-shell-sass/widgets/_message-list.scss
+++ b/data/theme/gnome-shell-sass/widgets/_message-list.scss
@@ -32,7 +32,7 @@
 
 // message bubbles
 .message {
-  @extend %notification_bubble;
+  @include notification_bubble;
 
   // title
   .message-title {